1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
|
'use client'
import { useState, useEffect } from 'react'
import { Button } from '@/components/ui/button'
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
import { Input } from '@/components/ui/input'
import { Label } from '@/components/ui/label'
import { Badge } from '@/components/ui/badge'
import { toast } from 'sonner'
import { Loader2, Send, RefreshCw } from 'lucide-react'
// CSV 필드를 정의할 타입
interface VendorFieldDef {
table: string;
name: string;
mandatory: boolean;
description: string;
}
// CSV 파싱 함수 (간단 파서)
const parseCSV = (csv: string): VendorFieldDef[] => {
const lines = csv.trim().split('\n');
// 첫 번째 라인은 헤더이므로 제거
return lines.slice(1).map((line) => {
const parts = line.split(',');
const table = parts[1]?.trim();
const name = parts[2]?.trim();
const mandatory = parts[3]?.trim() === 'M';
const description = parts.slice(6).join(',').trim();
return { table, name, mandatory, description } as VendorFieldDef;
});
};
// 기존 샘플 기본값 (필요 시 확장)
const sampleDefaults: Record<string, string> = {
BP_HEADER: 'TEST001',
ZZSRMCD: 'EVCP',
TITLE: 'TEST',
BU_SORT1: 'TEST VENDOR',
NAME_ORG1: '테스트 벤더 회사',
KTOKK: 'Z001',
VEN_KFBUS: '제조업',
VEN_KFIND: 'IT',
MASTERFLAG: 'X',
IBND_TYPE: 'U',
ZZREQID: 'TESTUSER01',
ADDRNO: '0001',
AD_NATION: '1',
COUNTRY: 'KR',
LANGU_COM: 'K',
POST_COD1: '06292',
CITY1: '서울시',
DISTRICT: '강남구',
REGION: '11',
MC_STREET: '테헤란로 123',
T_COUNTRY: 'KR',
T_NUMBER: '02-1234-5678',
F_COUNTRY: 'KR',
F_NUMBER: '02-1234-5679',
U_ADDRESS: 'https://test.vendor.com',
E_ADDRESS: 'contact@test.vendor.com',
BP_TX_TYP: 'KR2',
TAXNUM: '123-45-67890',
};
// XML escape helper
const escapeXml = (unsafe: string) => unsafe.replace(/[<>&'"']/g, (c) => {
switch (c) {
case '<': return '<';
case '>': return '>';
case '&': return '&';
case '"': return '"';
case "'": return ''';
default: return c;
}
});
export default function MDGTestPage() {
const [formData, setFormData] = useState<Record<string, string>>({});
const [fieldDefs, setFieldDefs] = useState<VendorFieldDef[]>([]);
const [resultXml, setResultXml] = useState<string>('');
const [isLoading, setIsLoading] = useState(false);
// CSV 로딩 및 초기 데이터 셋업
useEffect(() => {
const load = async () => {
const res = await fetch('/wsdl/P2MD3007_AO.csv');
const csvText = await res.text();
const defs = parseCSV(csvText);
setFieldDefs(defs);
const init: Record<string, string> = {};
defs.forEach((d) => {
init[d.name] = sampleDefaults[d.name] ?? '';
});
setFormData(init);
};
load();
}, []);
// 폼 데이터 업데이트
const updateField = (field: string, value: string) => {
setFormData(prev => ({ ...prev, [field]: value }));
};
// 기본값으로 리셋
const resetForm = () => {
const reset: Record<string, string> = {};
fieldDefs.forEach((d) => {
reset[d.name] = sampleDefaults[d.name] ?? '';
});
setFormData(reset);
toast.success('폼이 기본값으로 리셋되었습니다.');
};
// 테스트 송신 실행
const handleTestSend = async () => {
try {
setIsLoading(true);
// 필수 필드 검증
const requiredFields = fieldDefs.filter(d => d.mandatory).map(d => d.name);
const missingFields = requiredFields.filter(field => !formData[field]?.trim());
if (missingFields.length > 0) {
toast.error(`필수 필드가 누락되었습니다: ${missingFields.join(', ')}`);
return;
}
// XML 생성
const bodyContent = fieldDefs.map(f => {
const val = formData[f.name] ?? '';
return `<${f.name}>${escapeXml(val)}</${f.name}>`;
}).join('\n ');
const supplierXml = `<SUPPLIER_MASTER>\n ${bodyContent}\n </SUPPLIER_MASTER>`;
const envelope = `<?xml version="1.0" encoding="UTF-8"?>\n<soap:Envelope xmlns:soap=\"http://schemas.xmlsoap.org/soap/envelope/\" xmlns:p1=\"http://shi.samsung.co.kr/P2_MD/MDZ\">\n <soap:Header/>\n <soap:Body>\n <p1:MT_P2MD3007_S>\n <P2MD3007_S>\n ${supplierXml}\n </P2MD3007_S>\n </p1:MT_P2MD3007_S>\n </soap:Body>\n</soap:Envelope>`;
setResultXml(envelope);
toast.success('요청 XML이 생성되었습니다. 하단 영역을 확인하세요.');
} catch (error) {
console.error('테스트 송신 실패:', error);
toast.error('테스트 송신 중 오류가 발생했습니다.');
} finally {
setIsLoading(false);
}
};
return (
<div className="container mx-auto p-6 space-y-6">
<div className="flex items-center justify-between">
<div>
<h1 className="text-3xl font-bold">MDG VENDOR 마스터 테스트</h1>
<p className="text-muted-foreground mt-2">
VENDOR 마스터 데이터를 MDG 시스템으로 테스트 송신합니다
</p>
</div>
<div className="flex gap-2">
<Button variant="outline" onClick={resetForm}>
<RefreshCw className="w-4 h-4 mr-2" />
리셋
</Button>
<Button onClick={handleTestSend} disabled={isLoading}>
{isLoading ? (
<Loader2 className="w-4 h-4 mr-2 animate-spin" />
) : (
<Send className="w-4 h-4 mr-2" />
)}
테스트 송신
</Button>
</div>
</div>
{/* 동적 필드 렌더링 */}
{fieldDefs.length === 0 ? (
<p className="text-center text-muted-foreground">CSV 로딩 중...</p>
) : (
<div className="space-y-6">
{Object.entries(
fieldDefs.reduce((acc: Record<string, VendorFieldDef[]>, cur) => {
acc[cur.table] = acc[cur.table] ? [...acc[cur.table], cur] : [cur];
return acc;
}, {})
).map(([table, fields]) => (
<Card key={table}>
<CardHeader>
<CardTitle className="flex items-center gap-2">
{table}
{fields.some(f => f.mandatory) && (
<Badge variant="destructive">필수 포함</Badge>
)}
</CardTitle>
<CardDescription>{table} 테이블 입력</CardDescription>
</CardHeader>
<CardContent className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
{fields.filter((f, idx, arr) => arr.findIndex(x => x.name === f.name) === idx).map((field) => (
<div key={field.name}>
<Label htmlFor={field.name} className="flex items-center gap-1">
{field.name}
{field.mandatory && (
<Badge variant="destructive" className="ml-1">필수</Badge>
)}
</Label>
<Input
id={field.name}
value={formData[field.name] ?? ''}
onChange={(e) => updateField(field.name, e.target.value)}
/>
{field.description && (
<p className="text-xs text-muted-foreground mt-1">{field.description}</p>
)}
</div>
))}
</CardContent>
</Card>
))}
</div>
)}
{/* 송신 결과 영역 */}
<Card>
<CardHeader>
<CardTitle>송신 결과</CardTitle>
<CardDescription>
MDG 시스템으로의 송신 결과가 여기에 표시됩니다
</CardDescription>
</CardHeader>
<CardContent>
{resultXml ? (
<pre className="p-4 bg-muted max-h-96 overflow-auto text-xs whitespace-pre-wrap">
{resultXml}
</pre>
) : (
<div className="p-4 bg-muted rounded-lg">
<p className="text-sm text-muted-foreground">
테스트 송신 버튼을 클릭하면 결과가 표시됩니다.
</p>
</div>
)}
</CardContent>
</Card>
</div>
);
}
|